<template>
  <div>
    <moon-button level="main">主要按钮</moon-button>
    <moon-button>普通按钮</moon-button>
    <moon-button level="danger">危险按钮</moon-button>

    <moon-button theme="link" level="main">主要按钮</moon-button>
    <moon-button theme="link">普通按钮</moon-button>
    <moon-button theme="link" level="danger">危险按钮</moon-button>

    <moon-button theme="text" level="main">主要按钮</moon-button>
    <moon-button theme="text">普通按钮</moon-button>
    <moon-button theme="text" level="danger">危险按钮</moon-button>
  </div>
</template>

<script>
import MoonButton from '../lib/MoonButton.vue'
export default {
  components: {
    MoonButton
  },
  data() {
    return {
      sourceCodeTitle: '按钮主题',
      sourceCode:
        `<template>
  <div>
    <moon-button level="main">主要按钮</moon-button>
    <moon-button>普通按钮</moon-button>
    <moon-button level="danger">危险按钮</moon-button>

    <moon-button theme="link" level="main">主要按钮</moon-button>
    <moon-button theme="link">普通按钮</moon-button>
    <moon-button theme="link" level="danger">危险按钮</moon-button>

    <moon-button theme="text" level="main">主要按钮</moon-button>
    <moon-button theme="text">普通按钮</moon-button>
    <moon-button theme="text" level="danger">危险按钮</moon-button>
  </div>
</template>

<script>
import MoonButton from '../lib/MoonButton.vue'
export default {
  components: {
    MoonButton
  },
  data() {
    return {
      
    }
  }
}
</` + 'script>'
    }
  }
}
</script>
